﻿<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Plantilla22.aspx.vb" Inherits="Plantilla22" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Anchored Static Fixed Full Width Header/Footer Example 2</title>
<style type="text/css">
/*CSS RESET*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

strong {
	font-weight:bold;color:#0289ce;
}

em {
	font-style:oblique;
}

p {
	margin:15px 0;
}

.aligncenter, div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignleft {
	float: left;
}
.alignright {
	float: right;
}

h1 {font-size:180%;}
h2 {font-size:150%;}
h3 {font-size:125%;}
h4 {font-size:100%;}
h5 {font-size:90%;}
h6 {font-size:80%;}

a:link {color:#0289ce;}
a:hover {color:#f64274;}

/*End RESET - Begin Full Width CSS*/
	body {
		background:#07182E;
		color:#fff;
		font:13px Helvetica,  Arial,  sans-serif
	}

	.wrap {
		position:relative;
		margin:0 auto;
		width:900px;
	}
	
	#header, #footer {
		width:100%;
		float:left;
		padding:15px 0;
	}
	
	#header {
		background:#000000;
		position:fixed;
		z-index:99999;
		clear:both;
		height:70px;
		left:0;
	}
	
	#header .logo {
		float:left;
		width:300px;
		font-size:24px;
	}
	
	#header p {
		float:right;
		width:400px;
		margin:0;
	}
	
	#content {
		padding:15px 0;
		margin-top:120px;
		float:left;
	}
	
	#footer {
		background:#07182E;
		text-align:center;
		bottom:0;
		z-index:999999;
		height:20px;
	}
	
	#footer a {
		color:#fff;
	}
	
	
	/**/
	
	
   
	
</style>

<!-- -->
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
        <style>
            
            
            span.reference{
                position:fixed;
                left:10px;
                bottom:10px;
                font-size:11px;
            }
            span.reference a{
                color:#DF7B61;
                text-decoration:none;
                text-transform: uppercase;
                text-shadow:0 1px 0 #fff;
            }
            span.reference a:hover{
                color:#000;
            }
            .box{
                margin-top:86px; /*era 129 px,con 86 se ve maso,85 se va al centro*/
                height:50px; /*era 50 px*/
				width:100%;
                position:relative;
                background:#fff url(click.png) no-repeat 380px 180px;
				-moz-box-shadow:0px 0px 10px #aaa;
				-webkit-box-shadow:0px 0px 10px #aaa;
				-box-shadow:0px 0px 10px #aaa;
                top: 0px;
                left: 0px;
            }
            .box h2{
				color:#f0f0f0;
				padding:40px 10px;
				text-shadow:1px 1px 1px #ccc;
            }

        </style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(function () {
                /**
                * the menu
                */
                var $menu = $('#ldd_menu');

                /**
                * for each list element,
                * we show the submenu when hovering and
                * expand the span element (title) to 510px
                */
                $menu.children('li').each(function () {
                    var $this = $(this);
                    var $span = $this.children('span');
                    $span.data('width', $span.width());

                    $this.bind('mouseenter', function () {
                        $menu.find('.ldd_submenu').stop(true, true).hide();
                        $span.stop().animate({ 'width': '510px' }, 300, function () {
                            $this.find('.ldd_submenu').slideDown(300);
                        });
                    }).bind('mouseleave', function () {
                        $this.find('.ldd_submenu').stop(true, true).hide();
                        $span.stop().animate({ 'width': $span.data('width') + 'px' }, 300);
                    });
                });
            });
        </script>

</head>
<body >
    <form id="form1" runat="server">
    <div id="header">
	    <div class="wrap">
            
            <div class="logo">
                <img src="imagesIntra/simbolo.png" alt="" border=0 width="100px" height="86px"/>

                <div id="enca1" style="position:absolute; overflow:hidden; left:90px; top:25px; width:190px; height:30px; z-index:3">
                    <font color="#FF9900"><B>MiMovil</B></font><font class="ws28" color="#FFFFFF"><B>Intranet</B></font>
                </div>
             </div>
             
             <div id="enca2" style="position:absolute; overflow:hidden; left:450px; top:25px; width:300px; height:30px; z-index:3">
                 <asp:Label ID="Label1" runat="server" Text="Usuario: "></asp:Label>
                <asp:Label ID="lblUsuSesion" runat="server" Text=""></asp:Label>

             </div>

             <div id="enca3" style="position:absolute; overflow:hidden; left:800px; top:25px; width:100px; height:30px; z-index:3">
                <asp:LinkButton ID="LinkButton2" runat="server">Cerrar Sesión</asp:LinkButton>
             </div>



        </div>
             <!--menu chvre-->
             <div class="box">
             <ul id="ldd_menu" class="ldd_menu">
				<li>
					<span>Vacations</span><!-- Increases to 510px in width-->
					<div class="ldd_submenu">
						<ul>
							<li class="ldd_heading">By Location</li>
							<li><a href="#">South America</a></li>
							<li><a href="#">Antartica</a></li>
							<li><a href="#">Africa</a></li>
							<li><a href="#">Asia and Australia</a></li>
							<li><a href="#">Europe</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">By Category</li>
							<li><a href="#">Sun &amp; Beach</a></li>
							<li><a href="#">Adventure</a></li>
							<li><a href="#">Science &amp; Education</a></li>
							<li><a href="#">Extreme Sports</a></li>
							<li><a href="#">Relaxing</a></li>
							<li><a href="#">Spa and Wellness</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">By Theme</li>
							<li><a href="#">Paradise Islands</a></li>
							<li><a href="#">Cruises &amp; Boat Trips</a></li>
							<li><a href="#">Wild Animals &amp; Safaris</a></li>
							<li><a href="#">Nature Pure</a></li>
							<li><a href="#">Helping others &amp; For Hope</a></li>
							<li><a href="#">Diving</a></li>
						</ul>
						<a class="ldd_subfoot" href="#"> + New Deals</a>
					</div>
				</li>
				<li>
					<span>Equipment</span>
					<div class="ldd_submenu">
						<ul>
							<li class="ldd_heading">By Location</li>
							<li><a href="#">South America</a></li>
							<li><a href="#">Antartica</a></li>
							<li><a href="#">Africa</a></li>
							<li><a href="#">Asia and Australia</a></li>
							<li><a href="#">Europe</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">By Category</li>
							<li><a href="#">Sun &amp; Beach</a></li>
							<li><a href="#">Adventure</a></li>
							<li><a href="#">Science &amp; Education</a></li>
							<li><a href="#">Extreme Sports</a></li>
							<li><a href="#">Relaxing</a></li>
							<li><a href="#">Spa and Wellness</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">By Theme</li>
							<li><a href="#">Paradise Islands</a></li>
							<li><a href="#">Cruises &amp; Boat Trips</a></li>
							<li><a href="#">Wild Animals &amp; Safaris</a></li>
							<li><a href="#">Nature Pure</a></li>
							<li><a href="#">Helping others &amp; For Hope</a></li>
							<li><a href="#">Diving</a></li>
						</ul>
						<a class="ldd_subfoot" href="#"> + New Deals</a>
					</div>
				</li>
				<li>
					<span>Locations</span>
					<div class="ldd_submenu">
						<ul>
							<li class="ldd_heading">By Location</li>
							<li><a href="#">South America</a></li>
							<li><a href="#">Antartica</a></li>
							<li><a href="#">Africa</a></li>
							<li><a href="#">Asia and Australia</a></li>
							<li><a href="#">Europe</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">By Category</li>
							<li><a href="#">Sun &amp; Beach</a></li>
							<li><a href="#">Adventure</a></li>
							<li><a href="#">Science &amp; Education</a></li>
							<li><a href="#">Extreme Sports</a></li>
							<li><a href="#">Relaxing</a></li>
							<li><a href="#">Spa and Wellness</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">By Theme</li>
							<li><a href="#">Paradise Islands</a></li>
							<li><a href="#">Cruises &amp; Boat Trips</a></li>
							<li><a href="#">Wild Animals &amp; Safaris</a></li>
							<li><a href="#">Nature Pure</a></li>
							<li><a href="#">Helping others &amp; For Hope</a></li>
							<li><a href="#">Diving</a></li>
						</ul>
						<a class="ldd_subfoot" href="#"> + New Deals</a>
					</div>
				</li>
			</ul>
            </div>
                
        

    </div>
    
    <div class="wrap">
	<div id="content">
        
This is an example of centered body content!

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

'May it please your Majesty,' said Two, in a very humble tone, going down on one knee as he spoke, 'we were trying—'

'I see!' said the Queen, who had meanwhile been examining the roses. 'Off with their heads!' and the procession moved on, three of the soldiers remaining behind to execute the unfortunate gardeners, who ran to Alice for protection.

'You shan't be beheaded!' said Alice, and she put them into a large flower-pot that stood near. The three soldiers wandered about for a minute or two, looking for them, and then quietly marched off after the others.

    </div>
    </div>

    <div id="footer">
	    <div class="wrap">
                <div id="foot1" style="position:absolute; overflow:hidden; left:0px; top:300px; width:900px; height:34px; z-index:6">
                <img src="imagesIntra/pie2.png" alt="" border="0" width="900px" height="34px"/>
                </div>

                <div id="foot2" style="position:absolute; overflow:hidden; left:0px; top:304px; width:900px; height:30px; z-index:7">
                <div align="center"><font color="#FFFFFF"><b><i>CopyRight@2012. All Rights Reserved</i></b></font><font color="#FF6600"><b><i> MiMOVIL</i></b></font></div>
                </div>
        </div>
    </div>


    </form>
</body>
</html>
